var player = new Vue({
    el: '#player',
    data: {
        keywords: '',
        songArr: [],
        id: 0,
        musicUrl: '',
        albumUrl:'',
        commentArr:[],
        avatarUrl:[],
        flag:false,
        opened:false,
        mvId:'',
        showMv:false,
    },
    methods: {
        searchMusic: function () {
            // console.log(this.keywords);
            let that = this;
            axios.get('https://autumnfish.cn/search?keywords=' + that.keywords)
                .then(function (response) {
                    // console.log(response);
                    that.songArr = response.data.result.songs;
                    // console.log(that.songArr);
                    // that.id = response.data.result.songs.id;
                }, function (err) { })
        },
        playMusic: function (musicId) {
            // console.log(id);
            let that = this;
            axios.get('https://autumnfish.cn/song/url?id=' + musicId)
                .then(function (response) {
                    // console.log(response);
                    // console.log(response.data.data[0].url);
                    that.musicUrl = response.data.data[0].url;
                    that.getAlbum(musicId);
                    that.getComment(musicId);
                }, function (err) { })
        },
        getAlbum: function (musicId) {
            let that = this;
            axios.get('https://autumnfish.cn/song/detail?ids=' + musicId)
                .then(function (response) {
                    // console.log(response.data.songs[0].al.picUrl);
                    that.albumUrl = response.data.songs[0].al.picUrl;
                }, function (err) { })
        },
        getComment:function(musicId) {
            let that = this;
            axios.get(' https://autumnfish.cn/comment/hot?type=0&id='+musicId)
            .then(function(response){
                // console.log(response.data.hotComments);
                // console.log(response.data.hotComments.user.avatarUrl);
                that.commentArr = response.data.hotComments;
                for (let i = 0;i<that.commentArr.length;i++) {
                    that.avatarUrl[i] = that.commentArr[i].user.avatarUrl;
                }
            },function(err){})
        },
        play:function(){
            this.flag = true;
            this.opened = true;
        },
        pause:function(){
            this.flag = false;
        },
        openMv:function(mvId){
            let that = this;
            axios.get('https://autumnfish.cn/mv/url?id='+mvId)
            .then(function(response) {
                // console.log(response.data.data.url);
                that.mvId = response.data.data.url;
                that.showMv = true;
                var audio = document.querySelector('.myaudio');
                if (audio.play) {
                    audio.pause();
                }
            },function(err){})
        },
        hidMv:function(){
            this.showMv = false;
        }
    }
})